<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!doctype html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>用户登录注册界面</title>
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/LeisureSeeker/frontcss/css/styles.css">
	  <link rel="stylesheet" href="${pageContext.request.contextPath}/LeisureSeeker/frontcss/css/jigsaw.css">
	  <style>
	  	
	  	  #msg {
      width: 100%;
      line-height: 40px;
      font-size: 14px;
      text-align: center;
    }
	  </style>
</head>
<body>
	<div class="jq22-container" style="padding-top:100px " >
		<div class="login-wrap">
			<div class="login-html">
				<input id="tab-1" type="radio" name="tab" class="sign-in" checked><label for="tab-1" class="tab">登录</label>
				<input id="tab-2" type="radio" name="tab" class="sign-up"><label for="tab-2" class="tab">注册</label>
				<div class="login-form">
					<form id="myform">
					<div class="sign-in-htm">
					<div class="group" id="alert" style="color:red;opacity:0;">
							该用户不存在！！！
						</div>
						<div class="group">
							<label for="user" class="label">用户名</label>
							<input id="username" name="username"  type="text" class="input">
						</div>
						<div class="group">
							<label for="pass" class="label">密码</label>
							<input id=userpwd type="password" class="input" data-type="password">
						</div>
						<div class="group" id="warning" style="color:red;opacity:0;">
							密码有误，请重新输入 !
						</div>
						<div class="group">
							<div class="container">
							    <div id="captcha" style="position: relative" data-type="password"></div>
								<div id="msg"></div>
							</div>
						</div>
						<div class="group">
							<input id="check" type="checkbox" class="check" checked>
							<label for="check"><span class="icon"></span> 保持登录</label>
						</div>						
						<div class="group">
							<input type="button" class="button" value="登录" onClick="sub()">
						</div>
						<!--<div class="hr"></div>
						 <div class="foot-lnk">
							<a href="#forgot">忘记密码?</a>
						</div> -->
					</div>
					</form>
					<form id="newform">
					<div class="sign-up-htm">
						<div class="group">
							<label for="user" class="label">用户名</label>
							<input id="users" type="text" class="input" name="username">
						</div>
						<div class="group">
							<label for="pass" class="label">密码</label>
							<input id="passs" type="password" class="input" data-type="password" name="userpwd">
						</div>
						<!-- <div class="group">
							<label for="pass" class="label">重复密码</label>
							<input id="passs" type="password" class="input" data-type="password">
						</div> -->
						<div class="group">
							<label for="pass" class="label">邮箱地址</label>
							<input id="pass" type="text" class="input" name="email">
						</div>
						<div class="group">
							<label for="pass" class="label">电话</label>
							<input id="tel" type="text" class="input" name="tel">
						</div>
						<div class="group">
							<input type="button" class="button" value="立即注册" id="btn">
						</div>
						<div class="hr"></div>
						<div class="foot-lnk">
							<label for="tab-1">已经成员?</a>
						</div>
					</div>
					</form>
				</div>
			</div>
		</div>
	</div>	
	<script src="${pageContext.request.contextPath}/LeisureSeeker/frontcss/js/jigsaw.js"></script>
	<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<!-- cyf前端登录校验 -->
<script>
	 function sub(){
		 $.ajax({
				url : "${pageContext.request.contextPath}/userapi/frontlogin",
				type : "GET",
				data : {
					//将获取的文本框内容封装成user对象传过去校验
					"username" : $("#username").val(),
					"userpwd" : $("#userpwd").val()
				},
				success : function(data) {
					if (data.msg == "校验成功") {
						//通过控制器跳转登陆后的主界面
						//跳转首页控制器已经有了
						window.location.href = "${pageContext.request.contextPath}/home";
					} else {
						$('#warning').css("opacity", 1);
					}
				}
			})
		/* var name=document.getElementById('username').value;
		var pass=document.getElementById('password').value;
		var cname="admin";
		var cpass="123";
		if(name==cname && pass==cpass && flag==true){
		alert("登录成功!")
			//window.location.href="#";
		}else{
			if(flag==false){
				alert("验证失败!")
				return;
			}
			alert("用户名或密码错误!")
		} */
			} 
 	 jigsaw.init(document.getElementById('captcha'), function () {
  	 flag=true;
    document.getElementById('msg').innerHTML = '手速快如闪电'  
  })
  <!-- 前端登录校验 结束-->
</script>

<!-- cyf前端登录框失焦事件 -->
		<script>
			$(document).ready(function() {
				$("#username").change(function() {
					$.ajax({
						url : "${pageContext.request.contextPath}/userapi/adminlogin2",
						type : "GET",
						data : {
							//将获取的文本框内容封装成user对象传过去校验
							"username" : $("#username").val(),
						},
						success : function(data) {
							if (data.msg == "该用户不存在") {
								//alert("该用户不存在");
								$('#alert').css("opacity", 1);
								//$("#myform")[0].reset();//重新设置表单内容，清空了
							} else {
								$('#alert').css("opacity", 0);
							}
						}
					})
				})
			})
		</script>
		<!-- 前台登录校验 -->
		<!-- 前台注册功能 -->
		<script type="text/javascript">
		$("#btn").click(function () {
			 $.ajax({
		            type: "POST",
		            url:'${pageContext.request.contextPath}/userapi/zhuce',
		            data:{
		            	"username":$("#users").val(),
		            	"userpwd":$("#passs").val(),
		            	"email":$("#pass").val(),
		            	"tel":$("#tel").val(),
		            },
		            success: function (data) {
		              if(data.msg=="添加成功"){
		            	alert("注册成功");
		            	window.location.href = "tohome";
		              }else{
		            	  alert("注册失败");
			            	$("#newform")[0].reset();//重新设置表单内容，清空了
		              }
		            },
       })
		})
		<!-- 前台注册功能 -->
		</script>
</body>
</html>